<%@page contentType="text/html; charset=utf-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Fly用户设置</title>
    <link rel="stylesheet" type="text/css" href="../commons/iconfont/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="../commons/layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="../style/global.css"/>
    <script src="../js/jquery-3.3.1.min.js" type="text/javascript"></script>
    <script src="../commons/layui/layui.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="fly-header layui-bg-black">
    <div class="layui-container"><a class="fly-logo" name="headlink" href="javascript:gotoIndex();"> <img
            src="../img/logo.png"
            alt="layui">
    </a>
        <ul class="layui-nav fly-nav layui-hide-xs">
            <li class="layui-nav-item layui-this"><a href="javascript:gotoIndex();"><i class="iconfont icon-jiaoliu"></i>交流</a>
            </li>
            <li class="layui-nav-item"><a href="javascript:;"><i class="iconfont icon-chanpin"
                                                                 style="top: 1px;"></i>专区<span
                    class="layui-nav-more"></span></a>
                <dl class="layui-nav-child fly-nav-child layui-anim layui-anim-upbit">
                    <dd><a href="/vipclub/list/layuiadmin/">layuiAdmin</a></dd>
                    <hr>
                    <dd><a href="/vipclub/list/layim/">LayIM</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="http://www.layui.com/"><i class="iconfont icon-ui"></i>框架</a></li>
        </ul>
        <ul class="layui-nav fly-nav-user">
            <li class="layui-nav-item"><a class="fly-nav-avatar" href="https://fly.layui.com/user/"
                                          id="LAY_header_avatar">
                <cite class="layui-hide-xs nickName">${currentUser.nickName}</cite> <img
                    src="../upload/${currentUser.headImg}" class="topHead"> <span class="layui-nav-more "></span></a>
                <dl class="layui-nav-child layui-anim layui-anim-upbit">
                    <dd><a href="javascript:gotoUserCenter();">用户中心</a></dd>
                    <dd><a href="javascript:gotoUserAset();">基本设置</a></dd>
                    <hr>
                    <dd><a href="javascript:gotoUserMsg();">我的消息</a></dd>
                    <dd><a href="">已购产品</a></dd>
                    <dd><a href="javascript:gotoUserHomepage(${currentUser.id});">我的主页</a></dd>
                    <hr style="margin: 5px 0;">
                    <dd><a href="https://fly.layui.com/user/logout/" style="text-align: center;">退出</a></dd>
                </dl>
            </li>
            <span class="layui-nav-bar" style="left: 0px; top: 55px; width: 0px; opacity: 0;"></span>
        </ul>
    </div>
</div>
<div class="layui-container fly-marginTop fly-user-main">
    <ul class="layui-nav layui-nav-tree layui-inline" lay-filter="user">
        <li class="layui-nav-item"><a href="javascript:gotoUserHomepage(${currentUser.id});"> <i class="layui-icon"></i> 我的主页 </a></li>
        <li class="layui-nav-item"><a href="userCenter.jsp"> <i class="layui-icon"></i> 用户中心 </a>
        </li>
        <li class="layui-nav-item layui-this"><a href="javascript:gotoUserAset();"> <i class="layui-icon"></i> 基本设置
        </a></li>
        <li class="layui-nav-item "><a href="javascript:gotoUserInvitation();"> <i class="iconfont icon-tiezi"></i> 我的帖子
        </a></li>
        <li class="layui-nav-item "><a href="javascript:gotoUserMsg();"> <i class="layui-icon"></i> 我的消息 </a>
        </li>
        <li class="layui-nav-item "><a href="https://fly.layui.com/user/product/"> <i class="iconfont icon-chanpin"></i>
            已购产品 </a></li>
        <li class="layui-nav-item "><a href="https://fly.layui.com/user/extend/"> <i
                class="layui-icon layui-icon-component"></i>
            我的组件 </a></li>
        <span class="layui-nav-bar"></span>
    </ul>
    <div class="site-tree-mobile layui-hide"><i class="layui-icon"></i></div>
    <div class="site-mobile-shade"></div>
    <div class="fly-panel fly-panel-user" pad20="">
        <div class="layui-tab layui-tab-brief" lay-filter="user">
            <ul class="layui-tab-title" id="LAY_mine">
                <li class="layui-this" lay-id="info">我的资料</li>
                <li lay-id="avatar">头像</li>
                <li lay-id="pass">密码</li>
                <li lay-id="bind">帐号绑定</li>
            </ul>
            <div class="layui-tab-content" style="padding: 20px 0;">
                <div class="layui-form layui-form-pane layui-tab-item layui-show">
                    <form method="post" class="layui-form" >
                        <input type="hidden" name="uId" value="${currentUser.id}"/>
                        <div class="layui-form-item"><label for="L_email" class="layui-form-label">手机</label>
                            <div class="layui-input-inline"><input type="text" id="L_phone" name="tel" required=""
                                                                   lay-verify="phone"
                                                                   autocomplete="off" value="" class="layui-input"
                                                                   disabled="" style="cursor: not-allowed !important;">
                            </div>
                            <div class="layui-form-mid layui-word-aux"><span style="color: #5FB878">您已完成手机号绑定，已正式成为社区实名用户。</span>
                                手机号不支持修改。
                            </div>
                        </div>
                        <div class="layui-form-item"><label for="L_email" class="layui-form-label">邮箱</label>
                            <div class="layui-input-inline"><input type="text" id="L_email" name="email" required=""
                                                                   lay-verify="email"
                                                                   autocomplete="off" value="" class="layui-input">
                            </div>
                            <div class="layui-form-mid layui-word-aux"> 邮箱已绑定 &nbsp;&nbsp;</div>
                        </div>
                        <div class="layui-form-item"><label for="L_username" class="layui-form-label">昵称</label>
                            <div class="layui-input-inline"><input type="text" id="L_username" name="nickName"
                                                                   required="" lay-verify="required"
                                                                   autocomplete="off" value="" class="layui-input">
                            </div>
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <input id="L_sexn" type="radio" name="sex" value="男" title="男">
                                    <input id="L_sexs" type="radio" name="sex" value="女" title="女">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item"><label for="L_city" class="layui-form-label">城市</label>
                            <div class="layui-input-inline"><input type="text" id="L_city" name="city"
                                                                   autocomplete="off" value=""
                                                                   class="layui-input"></div>
                        </div>
                        <div class="layui-form-item layui-form-text"><label for="L_sign"
                                                                            class="layui-form-label">签名</label>
                            <div class="layui-input-block"> <textarea placeholder="随便写些什么刷下存在感" id="L_sign" name="signature"
                                                                      autocomplete="off"
                                                                      class="layui-textarea"
                                                                      style="height: 80px;"></textarea></div>
                        </div>
                        <div class="layui-form-item">
                            <button type="button" class="layui-btn" key="set-mine" lay-filter="edit-info" lay-submit>确认修改</button>
                        </div>
                    </form>
                </div>
                <div class="layui-form layui-form-pane layui-tab-item">
                    <div class="layui-form-item">
                        <div class="avatar-add">
                            <p>建议尺寸168*168，支持jpg、png、gif，最大不能超过50KB</p>
                            <input type="hidden" name="uId" value="${currentUser.id}"/>
                            <button type="button" class="layui-btn upload-img" id="test1"><i class="layui-icon"></i>上传头像
                            </button>
                            <input class="layui-upload-file" type="file" accept="" name="file"> <img
                                src="../upload/${currentUser.headImg}" id="L_headImg">
                            <span class="loading"></span>
                        </div>
                    </div>
                </div>
                <div class="layui-form layui-form-pane layui-tab-item">
                    <input type="hidden" name="uId" value="${currentUser.id}"/>
                    <input type="hidden" name="tel" value="${currentUser.tel}"/>
                    <div class="layui-form-item"><label for="L_nowpass" class="layui-form-label">当前密码</label>
                        <div class="layui-input-inline"><input type="password" id="L_nowpass" name="pass" required=""
                                                               lay-verify="required"
                                                               autocomplete="off" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item"><label for="L_pass" class="layui-form-label">新密码</label>
                        <div class="layui-input-inline"><input type="password" id="L_pass" name="nowpass" required=""
                                                               lay-verify="required"
                                                               autocomplete="off" class="layui-input"></div>
                        <div class="layui-form-mid layui-word-aux">6到16个字符</div>
                    </div>
                    <div class="layui-form-item"><label for="L_repass" class="layui-form-label">确认密码</label>
                        <div class="layui-input-inline"><input type="password" id="L_repass" name="repass" required=""
                                                               lay-verify="required"
                                                               autocomplete="off" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <button type="button" class="layui-btn" key="set-mine" lay-submit lay-filter="register">确认修改</button>
                    </div>
                </div>
                <div class="layui-form layui-form-pane layui-tab-item">
                    <ul class="app-bind">
                        <li class="fly-msg  "><i class="iconfont icon-qq"></i> <a href="https://fly.layui.com/app/qq"
                                                                                  onclick="layer.msg('&#39;正在绑定微博QQ&#39;, {icon:16, shade: 0.1, time:0}')"
                                                                                  class="acc-bind" type="qq_id">立即绑定</a>
                            <span>，即可使用QQ帐号登录Fly社区</span></li>
                        <li class="fly-msg "><i class="iconfont icon-weibo"></i> <a
                                href="https://fly.layui.com/app/weibo/" class="acc-weibo"
                                type="weibo_id" onclick="layer.msg('&#39;正在绑定微博&#39;, {icon:16, shade: 0.1, time:0}')">立即绑定</a>
                            <span>，即可使用微博帐号登录Fly社区</span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="fly-footer">
    <p><a href="http://fly.layui.com/">Fly 社区</a> 2019 © <a href="http://www.layui.com/">layui.com</a></p>
    <p><a href="http://fly.layui.com/jie/3147/" target="_blank">付费计划</a> <a href="https://fly.layui.com/extend/"
                                                                            target="_blank">组件平台</a>
        <a href="https://fly.layui.com/store/" target="_blank">模板市场</a> <a href="https://fly.layui.com/case/2019/"
                                                                           target="_blank">年度案例</a>
        <a href="http://fly.layui.com/jie/2461/" target="_blank">公众号</a></p>
    <div class="fly-union">
        <p style="display: block; margin-bottom: 10px;"><span>感谢以下平台提供云加速支持</span></p>
        <p><a href="https://console.upyun.com/register/?invite=SJ0wu6g2-" target="_blank" rel="nofollow"
              sponsor="upyun">
            <img src="../img/upyun.png"> </a> <a href="https://www.maoyuncloud.com/?from=layui" target="_blank"
                                                 rel="nofollow" sponsor="maoyun"> <img src="../img/168_1559291577683_9348.png"> </a></p>
    </div>
</div>
<script>
    window.onload = function () {
        layui.use(['util', 'carousel', 'layer', 'element', 'jquery','form','upload'], function () {
            var util = layui.util,
                carousel = layui.carousel,
                layer = layui.layer,
                element = layui.element,
                $ = layui.jquery,
                form = layui.form;
                upload = layui.upload;
        $.post('../user/userCenter',{"userId": ${currentUser.id}}, function (result) {
            let data = result.data;
            $("#L_phone").val(data.tel);
            $("#L_email").val(data.email);
            $("#L_username").val(data.nickName);
            let sex = data.sex;
            // console.log(sex);
            //检查是否被选中，待解决
            // if(sex != "男"){
            // 	$("#L_sexs").attr(checked,'checked');
            // }
            console.log(data);
            $("#L_city").val(data.city);
            $(".layui-textarea").val(data.signature);
            //确认修改
            form.on('submit(edit-info)',function(data){
                $.post('../user/edit',data.field,function(res) {
                    console.log(data.field);
                    layer.msg(res.msg);

                })
            });
            form.on('submit(register)', function (data) {
                //两次密码的验证
                if (data.field.pwd !== data.field.pwd2) {
                    layer.msg('两次密码输入不一致', {icon: 3});
                    return;
                }
                $.post('../user/editPwd', data.field, function (res) {
                    console.log(data.field);
                    layer.msg(res.msg);
                });
            });
            //修改头像
            var uploadInst = upload.render({
                elem: '#test1',//绑定元素
                url: '/user/editHeadImg',
                done:function (res) {
                    //layer.msg(JSON.stringify(res.data));
                    $("#L_headImg,.topHead").attr("src",res.data.src);
                },
            });
        });
    });
    };
</script>
<ul class="layui-fixbar">
    <li class="layui-icon" lay-type="bar1" style="background-color:#009688"></li>
    <li class="layui-icon layui-fixbar-top" lay-type="top" style="background-color:#009688"></li>
</ul>
<script src="../js/index.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>
